/**
* @Description: WoShop商城
* @Author: 梧桐
* @Copyright: 武汉一一零七科技有限公司©版权所有
* @Link: www.s1107.com
* @Contact: QQ:2487937004
*/
<template>
  <view class="index_class">
    <view class="rele-areat">
      <!--  app 端状态栏站位 -->
      
      <view class="lication-list">
        <view>类型</view>
        <picker @change="bindPickerChange" :value="index" :range="array" mode="selector">
          <view class="uni-input"> {{array[index]}}  <i class="iconfont icon_e60c"></i></view>
        </picker>
      </view>
      
      <view class="input-text">
        <textarea v-model="textValue" name="" id="" cols="30" rows="10" placeholder="想要说的话"></textarea>
        <view class="text-number">{{textValue.length}}/800</view>
      </view>
      
      <view class="addfile">
        <view class="grace-add-file">
          <view class="grace-add-btn" @tap="addImg" v-if="btnImg">
            <view>+</view><view>添加照片</view>
          </view>
          <view class="garce-items" v-for="(item, index) in imgLists" :key="index">
            <image :src="item" mode="widthFix" :data-imgurl="item" @tap="showImgs"></image>
            <view class="grace-close" @tap="removeImg" :id="'grace-items-img-'+index"></view>
          </view>
        </view>
      </view>
      
      
      <view class="person-button" style="margin:0;background-color:#fff;padding-top:40upx" >
        <!-- @click="getnav('/pagesB/personalSon/RefundDatecopy')" -->
        <button type="warn"  class="btn" @click="getaddthorder" >提交</button>
      
      </view>
    </view>
  </view>
</template>


<script>

var maxNum = 9, _self;
export default {
  data() {
    return {
      order_id:'',
      imgLists : [],
      btnImg : true,
      textValue:'',
      index:0,
      type:'',
      sortNum:'',
      array: ['恶意刷评行为', '捏造虚假消息','涉嫌情色言论','涉嫌恶意广告行为'],
      typeValue:'',
      id:'',
    }
  },
  
  onLoad(opiton){
    _self = this;
    this.id= opiton.reprotId;
    console.log(this.id)
  },
  
  methods:{
    
    
    bindPickerChange: function(e) {
      this.index = e.target.value;
      this.type = this.array[this.index];
    },
    addImg : function(){
      var num = maxNum - _self.imgLists.length;
      if(num < 1){return false;}
      
      uni.chooseImage({
        count: num,
        sizeType: ['compressed'],
        success: function(res) {
          _self.imgLists = _self.imgLists.concat(res.tempFilePaths);
          if (_self.imgLists.length >= maxNum){
            _self.btnImg = false;
          }
          uni.hideLoading();
          
        }
      });
    },
    removeImg : function(e){
      var index = e.currentTarget.id.replace('grace-items-img-', '');
      _self.imgLists.splice(index, 1);
      _self.imgLists = _self.imgLists;
      if (_self.imgLists.length < maxNum) {
        _self.btnImg = true;
      }
    },
    showImgs : function(e){
      var currentImg = e.currentTarget.dataset.imgurl;
      uni.previewImage({
        urls: this.imgLists,
        current : currentImg
      })
    },
    
    
    
    /**
     * 图片上传
     */
    getuploadspic () {
      if(this.imgLists.length == 0) {
        this.$toast('请先上传举报凭证')
        return false
      }
      return new Promise(resolve=>{
        this.$http.getuploadspic(this.imgLists,'api/find/uploadspic').then(res=>{
          if(res.status == 200) {
            resolve(res.images)
          }
        })
      })
    },
    /**
     *提交审核
     */
    async getaddthorder(){
      if(this.textValue == '') {
        this.$toast('请输入投诉内容')
        return false
      }
      // if(this.pickValue.length == '') {
      //  this.$toast('请输选择商品')
      //  return false
      // }
      let str = await this.getuploadspic()
      let data = {
        title:this.type,
        content:this.textValue,
        pic: str.join(','),
        id:this.id
      }
      this.$loading()
      this.$http.getFindReport(data).then(res=>{
        if(res.status == 200) {
          this.$toast(res.mess)
          setTimeout(()=>{
            this.getback()
          },1000)
        }
      })
    },
    
    
    
  }
}
</script>

<style>

</style>
